<template>
  <div class='dialog'>
    <div class='newAdd dialog-con edit-companyInfo'>
      <split-vertical title="编辑公司信息"></split-vertical>
      <div class="info">

        <el-form :model="editCompanyInfo"  ref="editCompanyInfo" label-width="110px"  class="demo-editCompanyInfo"   label-position = "right">
          <el-row>
            <el-col :span="12">
              <el-form-item label="公司名称" prop="companyName">
                <el-input v-model="editCompanyInfo.companyName"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="法人代表" prop="legalPersonName">
                <el-input v-model="editCompanyInfo.legalPersonName" style="width: 97%;"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="开户行名称" prop="bankAccountName">
                <el-input v-model="editCompanyInfo.bankAccountName"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="开户行账号" prop="bankAccountNumber">
                <el-input v-model="editCompanyInfo.bankAccountNumber" oninput="value=value.replace(/[^\d]/g,'')"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="12">
              <el-form-item label="纳税号" prop="registrationCode">
                <el-input v-model="editCompanyInfo.registrationCode"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item label="公司地址" >
            <v-distpicker  @province="onChangeProvince" @city="onChangeCity" @area="onChangeArea"   :province="editCompanyInfo.companyProvince" :city="editCompanyInfo.companyCity" :area="editCompanyInfo.companyDistrict" ></v-distpicker>
          </el-form-item>
          <el-form-item label="详细地址"  prop="companyAddress">
            <el-input v-model="editCompanyInfo.companyAddress" ></el-input>
          </el-form-item>
          <el-row>
            <el-col :span="12">
              <el-form-item label="客服电话" prop="customerServicePhone">
                <el-input v-model="editCompanyInfo.customerServicePhone" placeholder="请输入 例如：021-2233-3333"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="12">
              <el-form-item label="公司电话" prop="companyPhone">
                <el-input v-model="editCompanyInfo.companyPhone"  placeholder="请输入 例如：021-3322-0022" ></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <el-form-item class="btn">
            <el-button @click="saveCompanyInfo" type="primary" :disabled="isCompanyBtn" size="medium">提交</el-button>
            <el-button @click="cancel"  size="medium">取消</el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
  </div>
</template>
<script>

  import {localStorage} from 'js/localStorage'
  import SplitVertical from "components/common/Title"
  import { regionData,CodeToText } from 'element-china-area-data'
  import VDistpicker from 'v-distpicker'
  export default {
    inject:['reload'],
    components:{
      SplitVertical,VDistpicker
    },
    data(){
      return{
        //省市区
        options: regionData,
        selectedOptions: [],
        //创建按钮是否显示
        isCompanyBtn:false,
        newCompany:[
          {name:'公司名称',val:'必输项'},
          {name:'法人代表',val:'必输项'},
          {name:'我司对公账户名',val:'必输项'},
          {name:'账号',val:'必输项'}
        ],
        name:'',
        imageUrl: '',
        userId:'',
        companyProvince:null,
        companyCity:null,
        companyDistrict:null
      }
    },
    props:{
      editCompanyInfo:{
        type:Object,
        default:{}
      }
    },
    created(){
      this.userId= localStorage.get("userID")
    },
    methods:{
      saveCompanyInfo(){
        if(this.editCompanyInfo.customerServicePhone == ''){
          this.editCompanyInfo.customerServicePhone =null
        }
        if(this.editCompanyInfo.companyPhone == ''){
          this.editCompanyInfo.companyPhone =null
        }
        let param=this.editCompanyInfo
        param['userId']=this.userId
        if(this.companyDistrict){
          param.companyProvince =this.companyProvince
          param.companyProvince =this.companyCity
          param.companyDistrict =this.companyDistrict
        }
        this.isCompanyBtn=true
        let success=data=>{
          if(data.statusCode === '1'){
            this.$message.success('保存成功')
            this.isCompanyBtn=false;
            this.reload()
            this.$emit('closeDialog')
          }else{
            this.$message.error(data.statusMessage)
            this.isCompanyBtn=false;
          }
        }
        this.api.enterpriseUpdate(param,success)
      },
      cancel(){
        this.$emit('closeDialog')
      },
      onChangeProvince(province){
        this.editCompanyInfo.companyProvince=province.value
      },
      onChangeCity(city){
        this.editCompanyInfo.companyCity=city.value
      },
      onChangeArea(district){
        this.editCompanyInfo.companyDistrict=district.value
        this.editCompanyInfo.companyAddress = this.editCompanyInfo.companyProvince+this.editCompanyInfo.companyCity+this.editCompanyInfo.companyDistrict
      },
    }
  }
</script>
<style lang="scss" scoped>
  .edit-companyInfo{
    width:700px;
    height:500px;
    .companynews{
      h2{
        height:60px;
        line-height: 60px;
        text-indent: 20px;
        font-size: 20px;
      }
    }
    .el-input{
      width:99%;

    }
    .btn{
      width:97%;
      text-align: right;
      margin-top: 10px;
    }


  }
</style>



